<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>设置</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<link rel="stylesheet" href="../css/mui.min.css">
		<script src="../js/flexible.js" type="text/javascript" charset="utf-8"></script>
		<style>
			html,
			body {
				background-color: #f6f6f6;
				min-height: 100vh;
				font-size: 0.373rem;
			}
			
			ul,
			ol {
				list-style: none;
			}
			
			body input[type='text'],
			ul,
			li {
				padding: 0;
				margin: 0;
			}
			
			.clear {
				clear: both;
				height: 0;
				font-size: 0;
				line-height: 0;
				visibility: hidden;
				overflow: hidden;
			}
			/*顶部*/
			
			.my_top {
				height: 4.57rem;
				background: url(../images/my_bg.png) no-repeat;
				background-size: 100% 100%;
			}
			
			.my_topz {
				padding: 1.16rem 0.493rem 0;
				display: flex;
			}
			
			.my_top_tx {
				background: url(../images/my_txbg.png) no-repeat;
				background-size: 100% 100%;
				width: 1.933rem;
				height: 1.933rem;
				display: flex;
				align-items: center;
				justify-content: center;
			}
			
			.my_top_zi {
				padding-left: 0.466rem;
			}
			
			.my_top_tx img {
				height: 1.53rem;
				width: 1.53rem;
				border-radius: 50%;
			}
			
			.my_login {
				width: 2.053rem;
				height: 0.533rem;
			}
			
			.my_login img {
				width: 100%;
				height: 100%;
			}
			
			.my_top_name h3 {
				color: #fff;
				line-height: 0.9rem;
				font-size: 0.459rem;
			}
			
			.my_top_nameh3 {
				display: flex;
				display: flex;
				align-items: center;
				justify-content: center;
			}
			
			.my_top_nameh3 img {
				height: 0.453rem;
				width: 0.453rem;
				margin-left: 0.4rem;
			}
			
			.my_lie {
				padding: 0.253rem 0;
			}
			
			.my_lie_li {
				display: flex;
				background: #fff;
				padding: 0.44rem 0.386rem;
				justify-content: space-between;
				line-height: 0.666rem;
				border-bottom: 1px solid #e2e2e2;
			}
			
			.my_lie_li h4 {
				font-size: 0.373rem;
				line-height: 0.666rem;
				margin: 0;
			}
			
			.my_li_left {
				display: flex;
			}
			
			.my_li_right {
				display: flex;
				justify-content: center;
				align-items: center;
			}
			
			.my_li_right i {
				background: url(../images/my_01.png) no-repeat;
				background-size: 100% 100%;
				height: 0.306rem;
				width: 0.186rem;
			}
			
			.my_li_right h4 {
				color: #888888;
				padding-right: 0.36rem;
			}
			
			.my_li_left h4 {
				padding-left: 0.36rem;
				color: #353535;
			}
			
			.my_content {
				background: #f6f6f6;
			}
			
			.my_content button {
				background: url(../images/my_buttom.png) no-repeat;
				color: #FFFFFF;
				line-height: 1.266rem;
				height: 1.266rem;
				width: 100%;
				padding: 0;
				box-sizing: border-box;
				background-size: 100% 100%;
				border: 0;
			}
			
			.my_butn {
				margin: 1.093rem 0.373rem;
			}
			
			.my_li_right a {
				display: flex;
				align-items: center;
			}
		</style>
	</head>

	<body>
		<!--顶部-->
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">设置</h1>
		</header>
		<div class="my_content mui-content">
			<div class="my_lie">
				<ul>
					<li class="my_lie_li">
						<div class="my_li_left my_li_left1">
							<h4>检查更新</h4>
						</div>
						<div class="my_li_right">
							<i></i>
						</div>
					</li>
					<li class="my_lie_li"  data-href='feedback.html'>
						<div class="my_li_left my_li_left1">
							<h4>意见反馈</h4>
						</div>
						<div class="my_li_right">
							<i></i>
						</div>
					</li>
					<li class="my_lie_li">
						<div class="my_li_left my_li_left3"  >
							<h4>帮助中心</h4>
						</div>
						<div class="my_li_right">
							<i></i>
						</div>
					</li>
					<li class="my_lie_li" data-href="my_about.html">
						<div class="my_li_left my_li_left4">
							<h4>关于我们</h4>
						</div>
						<div class="my_li_right">
							<i></i>
						</div>
					</li>
				</ul>
				<div class="my_butn"><button id="button">退出登录</button></div>
			</div>
		</div>
	</body>

</html>
<script src="../js/mui.min.js"></script>
<script src="../js/js.js"></script>
<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/tools/util.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
	mui.init()
	//自定义跳转
	mui('.mui-content').on('tap', 'li', function() {
		var href = this.getAttribute('data-href');
		if (href == null || href == '') {
			return false;
		}else{
			mui.openWindow(href, href)
		}
	})
	var btn = document.getElementById('button');
	btn.addEventListener('tap', function() {
		var user = get_user_info();
		if(user) { 
			var number  = Storage.get('usernumber');
			localStorage.clear();
			localStorage.setItem('usernumber',JSON.stringify(number))
			mui.toast("已成功退出");
			mui.openWindow({
				url: 'logn.html',
				id: 'logn.html',
				creatNew:true
			});
		} else {
			mui.toast("退出失败")
		}

	})
</script>